<template>
  <div>
      <van-nav-bar
          title="详情"
          left-text="返回"
          left-arrow
          @click-left="onBack"
      />
      <van-tabs v-model="active">
          <van-tab title="标签 1">
              <van-cell title="公司编号">{{info.ItemNo}}</van-cell>
              <van-cell title="品名">{{info.Item_C_Name}}</van-cell>
              <van-cell title="数量">{{info.PurQty}}</van-cell>
              <van-cell title="装箱量">{{info.UnitBoxQty}}</van-cell>
              <van-cell title="件数">{{info.PoPurBoxQty}}</van-cell>
              <van-cell title="长">{{info.PackLength}}</van-cell>
              <van-cell title="宽">{{info.packwidth}}</van-cell>
              <van-cell title="高">{{info.packhigh}}</van-cell>
              <van-cell><van-field label="长" v-model="info.qcPackLength" placeholder="请输入长度" /></van-cell>
              <van-cell><van-field label="宽" v-model="info.qcpackwidth" placeholder="请输入宽度" /></van-cell>
              <van-cell><van-field label="长" v-model="info.qcpackhigh" placeholder="请输入高度" /></van-cell>
          </van-tab>
          <van-tab title="标签 2">

          </van-tab>
      </van-tabs>
  </div>
</template>
<script>
  import { Field, Button, Cell, CellGroup, NavBar, Row, Col, Icon, Tab, Tabs } from 'vant'
  import { QCDtlInfo } from '@/api'

  export default {
    components: {
      [NavBar.name]: NavBar,
      [Row.name]: Row,
      [Col.name]: Col,
      [Field.name]: Field,
      [Cell.name]: Cell,
      [CellGroup.name]: CellGroup,
      [Icon.name]: Icon,
      [Tab.name]: Tab,
      [Tabs.name]: Tabs,
      [Button.name]: Button
    },
    data () {
      return {
        active: 0,
        info: {}
      }
    },
    methods: {
      getInfo (id) {
        QCDtlInfo(id).then((res) => {
          this.info = res.data
        })
      },
      onBack () {
        this.$router.back()
      }
    },
    mounted () {
      this.getInfo(this.$route.params.fid)
    }
  }
</script>
<style lang="less">
  .user {
    &-poster {
      width: 100%;
      height: 53vw;
      display: block;
    }
    &-group {
      margin-bottom: 15px;
    }
    &-links {
      padding: 15px 0;
      font-size: 12px;
      text-align: center;
      background-color: #fff;
      .van-icon {
        display: block;
        font-size: 24px;
      }
    }
  }
</style>
